<template>
  <div class="app-container">
    <div class="qrCodeContainer" style="width: 450px; height: 50px; display: none; width: 100%">
      <div class="title1" v-for="(iten, index) in printListMehtodsTableDate" :key="index">
        <h1 class="title" style="width: 480px; margin-left: 40%; font-size: 20px">{{ companyId === 'HF' ? $t(`Print.RongCangClothingReplenishmentList`) : $t(`Print.RongyangClothingReplenishmentList`) }}</h1>
        <div style="width: 100%; margin: auto">
          <div style="display: flex; width: 100%; font-size: 13px; justify-content: space-between">
            <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.ProcessingOrderNumber`) }}:{{ iten?.purNo }}</h2>
            <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.IssueWarehouse`) }}:{{ iten?.stkName }}</h2>
            <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.LaminationManufacturer`) }}:{{ iten?.vendorName }}</h2>
            <div>
              <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.TheDateOnWhichTheOrderWasMade`) }}:{{ iten?.sysDate }}</h2>
              <h2 style="margin-left: 70px; font-size: 13px">{{ $t(`Print.RequirementDate`) }}:{{ iten?.inDate }}</h2>
            </div>
          </div>

          <div style="width: 100%">
            <table style="width: 100%; font-size: 13px">
              <thead>
                <tr>
                  <th>{{ $t(`Print.Directives`) }}</th>
                  <th>{{ $t(`Print.Body`) }}</th>
                  <th>{{ $t(`Print.Color`) }}</th>
                  <th>{{ $t(`Print.Material`) }}</th>
                  <th>{{ $t(`Print.Wide`) }}</th>
                  <th>{{ $t(`Print.Unit`) }}</th>
                  <th>{{ $t(`Print.OrderQuantity`) }}</th>
                  <th>{{ $t(`Print.Remark`) }}</th>
                </tr>
              </thead>
              <tbody>
                <tr v-for="(iten1, index) in iten.myOrdList" :key="index">
                  <td>{{ iten1.purLot }}</td>

                  <td>{{ iten1.purStyle }}</td>
                  <td>{{ iten1.mtlColor }}</td>
                  <td>{{ iten1.mtlName }}</td>

                  <td>{{ iten1.mtlSpec }}</td>
                  <td>{{ iten1.mtlUnit }}</td>

                  <td>{{ iten1.qty }}</td>

                  <td>{{ iten1.remark }}</td>
                  <!-- 更多的数据单元格 -->
                </tr>
                <!-- 更多的行 -->
              </tbody>
              <!-- 可选的 tfoot 部分 -->
            </table>

            <!-- <Table :tableHeader="tableHeader5" :tableData="slipNoList" /> -->
          </div>

          <div style="display: flex; justify-content: space-between; width: 85%; font-size: 17px; width: 80%; margin: auto">
            <h2 style="font-size: 13px">{{ $t(`Print.Manufacturers`) }}:</h2>
            <h2 style="font-size: 13px">{{ $t(`Print.UnitSupervisor`) }}:</h2>
            <h2 style="font-size: 13px">{{ $t(`Print.OrderCreator`) }}:{{ iten?.sysName }}</h2>
          </div>
        </div>
      </div>
    </div>

    <Find :OriginalFilter="{ static: true }" :formList="formList1" @Launchform="Launchform" @findClicked="findClicked" />

    <el-card style="margin-top: 5px" shadow="always" :body-style="{ padding: '5px' }">
      <div>
        <div>
          <h1>{{ $t(`Print.RequisitionInquiryOrderProcessing`) }}</h1>
          <Table
            :isLoading="isLoading7"
            @selectList="selectList6"
            :selection="true"
            :tableHeader="tableHeader"
            :tableData="RequisitionEnquiryMethodsTableDateList.dtos"
            :TableHeight="100"
            :outTableHeight="55"
          />
        </div>
      </div>
      <PageModule :PageData="{ total: totalTk }" @pageSizeChange="handleSizeChangeTk" @pageChange="handleCurrentChangeTk" />
    </el-card>

    <el-drawer v-model="drawer3" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer3 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <h1>{{ $t(`Print.QueryCondition`) }}</h1>
      <Find
        :OriginalFilter="{ static: true }"
        :searchImg="false"
        :formList="formList2"
        @Launchform="Launchform1"
        @findClicked="findClicked1"
        @clickNumber="clickNumber"
      />
      <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList5" @Launchform="Launchform3" @findClicked="findClicked1" />
      <div style="margin-top: 10px; display: flex">
        <div class="divNitive" style="width: 85%">
          <h1>{{ $t(`Print.MyPurchaseorder`) }}</h1>
          <Table
            :isLoading="isLoading8"
            @selectList="selectList5"
            @inputChange="inputChange"
            :getTableList="MyPurchaseOrderMethods"
            @currentRow="clicktogetdata"
            :selection="true"
            :tableHeader="tableHeader1"
            :tableData="MyPurchaseOrderMethodsTableDateList.dtos"
            :TableHeight="40"
            :outTableHeight="110"
          />
          <PageModule :PageData="{ total }" @pageSizeChange="handleSizeChange" @pageChange="handleCurrentChange" />
        </div>
        <div style="margin-left: 20px">
          <h1>{{ $t(`Print.InstructionDetails`) }}</h1>
          <Table
            :isLoading="isLoading9"
            :tableHeader="tableHeader2"
            :tableData="InstructionDetailQueryMedhotsTableDateList"
            :TableHeight="40"
            :outTableHeight="110"
          />
        </div>
      </div>
      <Table
        :isLoading="isLoading10"
        style="width: 70%"
        :tableHeader="tableHeader3"
        :tableData="FitSubMaterialQueryMethodsTableDateList"
        :TableHeight="50"
        :outTableHeight="110"
      />
    </el-drawer>

    <el-drawer v-model="drawer2" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer2 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <h1>{{ $t(`Print.QueryCondition`) }}</h1>
      <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList3" @findClicked="findClicked2" />
      <Table
        :isLoading="isLoading11"
        @checkboxChange="change"
        :getTableList="FitSubMaterialQueryMethods1"
        @inputChange="inputChange2"
        @currentRow="clicktogetdata3"
        style="margin-top: 20px"
        :tableHeader="tableHeader5"
        :tableData="FitSubMaterialQueryMethods1TableDates"
        :TableHeight="100"
        :outTableHeight="55"
      />
    </el-drawer>

    <el-drawer v-model="drawer4" :direction="'ttb'" size="small" :with-header="false">
      <span @click="drawer4 = false" style="float: right; cursor: pointer; color: rgb(7, 7, 7)">X</span>
      <h1>{{ $t(`Print.QueryCondition`) }}</h1>
      <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList6" @Launchform="Launchform5" />
      <Find :OriginalFilter="{ static: true }" :searchImg="false" :formList="formList7" />
      <div style="margin-top: 10px; display: flex">
        <div style="width: 85%">
          <h1>{{ $t(`Print.MyPurchaseorder`) }}</h1>
          <Table
            :isLoading="isLoading8"
            @currentRow="clicktogetdata6"
            :tableHeader="tableHeader6"
            :tableData="MyPurchaseOrderMethodsTableDateList.dtos"
            :TableHeight="80"
            :outTableHeight="110"
          />

          <PageModule :PageData="{ total }" @pageSizeChange="handleSizeChange" @pageChange="handleCurrentChange" />
        </div>
        <div style="margin-left: 20px">
          <h1>{{ $t(`Print.InstructionDetails`) }}</h1>
          <Table
            :isLoading="isLoading9"
            :tableHeader="tableHeader7"
            :tableData="InstructionDetailQueryMedhotsTableDateList"
            :TableHeight="40"
            :outTableHeight="110"
          />
        </div>
      </div>
    </el-drawer>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'FitOutsourcingProcessing'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ref, onMounted } from 'vue'
import {
  printList,
  RemarkQuery,
  RequisitionEnquiry,
  OrderBatchProcessing,
  MyPurchaseOrder,
  InstructionDetailQuery,
  FitSubMaterialQuery,
  classifyQuery,
  VendorQuery,
  BatchProcessingOutOfStorage,
  BatchProcessingOutOfStorage1,
  TheDeliveryOrderIsCancelled,
  returnOrder
} from '@/api/WarehouseDepartment/FactoryStorage/FitOutsourcingProcessing'
import type {
  date,
  RequisitionEnquiryParms,
  RequisitionEnquiryInterface,
  MyPurchaseOrderInterface,
  MyPurchaseOrderParms
} from '@/api/WarehouseDepartment/FactoryStorage/FitOutsourcingProcessing'
import LoginWork from '@/utils/LoginWork'
import { ElMessage } from 'element-plus'
import { ElMessageBox } from 'element-plus'

const slipNoList3 = ref<any>([])

const printQRCode = () => {
  const qrCodeContainer = document.querySelector<any>('.qrCodeContainer')
  if (qrCodeContainer) {
    // 临时显示 .qrCodeContainer 以获取其内容
    qrCodeContainer.style.display = 'block'

    const printWindow = window.open('', '_blank')
    printWindow!.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>打印指令领料作业</title>
          <link rel="stylesheet" type="text/css" href="print.css" media="print">
          <style>
            body, html {
              margin: 0;
              padding: 0;
            }
            @page {
              size: auto; 
              margin: 3mm;
            }
            @media print {
                /* 打印时的样式 */
             
                .title1{  
                              page-break-after: always; /* 每个二维码后分页 */  
                          }  
                /* 其他打印样式 */
            }
            h2 {
                    margin-left: initial; /* 或者设置适合打印的左边距 */
                    page-break-inside: avoid; /* 避免在h2元素内部分页 */
                }
               

            table, th, td {
                    border: 1px solid black; 
                    border-collapse: collapse; 
                    text-align: center;
                  }
                  th, td {
                    padding: 5px; /* 设置内边距 */
                    text-align: left; /* 设置文本对齐方式 */
                    text-align: center;
                    font-size:11px
                  }
                  .double-line {
                    border-top: 2px dashed red; 
                    border-bottom: 2px dashed red; 
                    text-align: center;
                  }
           
            /* 可以在这里添加更多自定义的打印样式 */
          </style>
        </head>
        <body>
    `)

    // 将 .qrCodeContainer 的内容复制到打印窗口的 body 中
    const cloneContainer = qrCodeContainer.cloneNode(true)
    printWindow!.document.body.appendChild(cloneContainer)

    printWindow!.document.write(`
        </body>
      </html>
    `)
    printWindow!.document.close()

    // 开始打印
    printWindow!.print()

    // 打印完成后，可以恢复 .qrCodeContainer 的原始显示状态
    qrCodeContainer.style.display = 'none'
  }
}

const typeList = ref()

const purNoList = ref([])

// 打印数据
const printListMehtodsTableDate = ref<any>([])

const printListMehtods = async () => {
  try {
    const result = await printList(typeList.value, purNoList.value)
    if (result.code === 200) {
      printListMehtodsTableDate.value = result.data
    } else {
      JMessage.error(result.message)
    }
  } catch (error) {
    JMessage.error('打印数据查询出错')
  }
}

const isLoading7 = ref(false)
const isLoading8 = ref(false)
const isLoading9 = ref(false)
const isLoading10 = ref(false)
const isLoading12 = ref(false)
const isLoading13 = ref(false)
const formList1 = ref([
  {
    type: 'input',
    inputPlaceholder: '指令',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '颜色',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '材料名称',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '型体',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },

  {
    type: 'button',
    checkboxLabel: '下单批处理'
  },
  {
    type: 'button',
    checkboxLabel: '进入我的订购单'
  },
  {
    type: 'button',
    checkboxLabel: '进入所有订购单'
  }
])

const formList2 = ref([
  {
    type: 'input',
    inputPlaceholder: '订购单号',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '类别',
    selectLabel: '',
    selectOptions: [
      { optionKey: 0, optionValue: '汇总', optionLabel: '汇总' },
      { optionKey: 1, optionValue: '零星', optionLabel: '零星' },
      { optionKey: 2, optionValue: '补料', optionLabel: '补料' },
      { optionKey: 3, optionValue: '五金', optionLabel: '五金' }
    ]
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '分类',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'date',
    dateLabel: '订购日期',
    dateValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '型体',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '配色',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '指令',
    inputValue: ''
  },
  {
    type: 'radio',
    checkboxLabel: '未下单',
    checked: true,
    label: '1'
  },
  {
    type: 'radio',
    checkboxLabel: '未导出',
    checked: false,
    label: '2'
  },
  {
    type: 'radio',
    checkboxLabel: '已下单',
    checked: false,
    label: '3'
  },
  {
    type: 'radio',
    checkboxLabel: '全部',
    checked: false,
    label: '4'
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材料名称',
    inputValue: ''
  },
])

const formList3 = ref([
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '',
    inputDisabled: true
  },
  {
    type: 'button',
    checkboxLabel: '出库批处理'
  },
  {
    type: 'button',
    checkboxLabel: '打印'
  },
  {
    type: 'button',
    checkboxLabel: '出库单取消'
  }
])

const formList5 = ref([
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'dateSingle',
    dateLabel: '需求日期',
    dateValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '备注',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'button',
    checkboxLabel: '置空',
    bgColor: '#1890FF'
  },
  {
    type: 'button',
    checkboxLabel: '形成订购单'
  },
  {
    type: 'button',
    checkboxLabel: '打印未打印订购单'
  },
  {
    type: 'button',
    checkboxLabel: '打印选中订购单'
  },
  {
    type: 'button',
    checkboxLabel: '出库批处理'
  },
  {
    type: 'button',
    checkboxLabel: '退单'
  }
])

const formList6 = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入订购单号',
    inputValue: ''
  },
  {
    type: 'input',
    inputPlaceholder: '请输入指令',
    inputValue: ''
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '类别',
    selectLabel: '',
    selectOptions: [
      { optionKey: 0, optionValue: '汇总', optionLabel: '汇总' },
      { optionKey: 1, optionValue: '零星', optionLabel: '零星' },
      { optionKey: 2, optionValue: '补料', optionLabel: '补料' },
      { optionKey: 3, optionValue: '五金', optionLabel: '五金' }
    ]
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '分类',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'select',
    selectValue: '',
    selectP: '厂商',
    selectLabel: '',
    selectOptions: []
  },
  {
    type: 'date',
    dateLabel: '订购日期',
    dateValue: ''
  },
  {
    type: 'button',
    checkboxLabel: '打印订购单'
  },
  {
    type: 'button',
    checkboxLabel: '打印订购条码'
  },
  {
    type: 'input',
    inputPlaceholder: '请输入材料名称',
    inputValue: ''
  },
])

const formList7 = ref([
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '材料名称'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '物料编码'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '单位'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '请购单号'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '请购部门'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '请购日期'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '需求日期'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '请购备注'
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '',
    inputLabel: '取消数量'
  },

])

// 出库单取消
const TheDeliveryOrderIsCancelledMethdosParms = ref()

const TheDeliveryOrderIsCancelledMehtods = async () => {
  if (TheDeliveryOrderIsCancelledMethdosParms.value === null) {
    JMessage.warning('请先出库批处理')
  } else {
    const result = await TheDeliveryOrderIsCancelled(TheDeliveryOrderIsCancelledMethdosParms.value)
    if (result.code === 200) {
      JMessage.success(result.message)
    } else {
      JMessage.error(result.message)
    }
  }
}

// 获取备注
const RemarkQueryMethods = async () => {
  const reuslt = await RemarkQuery()
  formList5.value[2].selectOptions = EvaluatesTheArrayReturnValue(reuslt)
}

const clicktogetdata6 = (row: any) => {
  console.log(row)
  const { reqNo, purLot, mtlNo, mtlName, mtlUnit, remark, dept, purDate, vendorDate, cancelQty } = row
  formList7.value[0].inputValue = mtlName
  formList7.value[1].inputValue = mtlNo
  formList7.value[2].inputValue = mtlUnit
  formList7.value[3].inputValue = reqNo

  formList7.value[4].inputValue = dept
  formList7.value[5].inputValue = purDate
  formList7.value[6].inputValue = vendorDate
  formList7.value[7].inputValue = remark

  formList7.value[8].inputValue = cancelQty

  reqNo1.value = reqNo
  purLot1.value = purLot
  mtlNo1.value = mtlNo
  InstructionDetailQueryMedhots()
}

const Launchform5 = (row: any) => {
  MyPurchaseOrderMethodsPamrs.value.purNo = row[0].inputValue
  MyPurchaseOrderMethodsPamrs.value.purLot = row[1].inputValue
  MyPurchaseOrderMethodsPamrs.value.mtlType = row[3].selectValue.split(' ')[0]
  MyPurchaseOrderMethodsPamrs.value.vendorNo = row[4].selectValue.split(' ')[0]

  MyPurchaseOrderMethodsPamrs.value.purDateStart = row[5].dateValue[0]
  MyPurchaseOrderMethodsPamrs.value.purDateEnd = row[5].dateValue[1]
  MyPurchaseOrderMethodsPamrs.value.mtlName = row[8].inputValue
  MyPurchaseOrderMethods()
}

// 进入所有订单
const drawer4 = ref(false)

// 出库批处理
const flag = ref()

const change = async (row: any, prop: any) => {
  console.log(row, prop)
  const result = await LoginWork.put<any, date>(
    `/pcFactorStockQuery/fdMtlSumUpdate?flag=${1}`,
    [prop].map((item: any) => {
      if (item.purFlag === true) {
        item.purFlag = 'Y'
      } else {
        item.purFlag = null
      }
      item.purLot = item.lotNo
      item.mtlNo = item.subMtlNo
      return item
    })
  )
  if (result.code === 200) {
    FitSubMaterialQueryMethods1()
    JMessage.success(result.message)
  } else {
    FitSubMaterialQueryMethods1()
    JMessage.error(result.message)
  }
}

const inputChange2 = async (row: any) => {
  const result = await LoginWork.put<any, date>(
    `/pcFactorStockQuery/fdMtlSumUpdate?flag=${1}`,
    [row].map((item: any) => {
      item.purLot = purLotMo.value
      item.purLotUp = item.lotNo
      item.mtlNo = mtlNo5.value
      item.mtlNoUp = item.subMtlNo
      return item
    })
  )
  if (result.code === 200) {
    FitSubMaterialQueryMethods1()
    JMessage.success(result.message)
  } else {
    FitSubMaterialQueryMethods1()
    JMessage.error(result.message)
  }
}

const findClicked2 = (count: any) => {
  if (count === '出库批处理') {
    flag.value = 2
    if (BatchProcessingOutOfStorage1Parms.value === undefined) {
      JMessage.warning('请选择需要出库批处理的数据')
    } else {
      BatchProcessingOutOfStorage1Methods()
    }
  }
  if (count === '出库单取消') {
    if (TheDeliveryOrderIsCancelledMethdosParms.value === undefined) {
      JMessage.warning('请选择需要出库单取消的数据')
    } else {
      TheDeliveryOrderIsCancelledMehtods()
    }
  }
}

const BatchProcessingOutOfStorage1Parms = ref()

const BatchProcessingOutOfStorage1Methods = async () => {
  const result = await BatchProcessingOutOfStorage1(
    [BatchProcessingOutOfStorage1Parms.value].map((item: any) => {
      delete item.change
      return item
    }),
    flag.value
  )
  if (result.code === 200) {
    FitSubMaterialQueryMethods1()
    JMessage.success(result.message)
  } else {
    FitSubMaterialQueryMethods1()
    JMessage.error(result.message)
  }
}

const purLotMo = ref()

const mtlNo5 = ref()

const clicktogetdata3 = (row: any) => {
  BatchProcessingOutOfStorage1Parms.value = row
  purLotMo.value = row.lotNo
  mtlNo5.value = row.subMtlNo
  TheDeliveryOrderIsCancelledMethdosParms.value = row.slipNo
}

// 厂商分页查询
const activeList = ref<any>()

const inputChange = async (row: any) => {
  const result = await LoginWork.put<any, any>('/pcFactorStockQuery/myOrdUpdate', row)
  if (result.code === 200) {
    MyPurchaseOrderMethods()
    formList5.value[0].selectValue = ''
    formList5.value[1].dateValue = ''
    formList5.value[2].selectValue = ''
    JMessage.success(result.message)
  } else {
    // MyPurchaseOrderMethods()
    formList5.value[0].selectValue = ''
    formList5.value[1].dateValue = ''
    formList5.value[2].selectValue = ''
    JMessage.error(result.message)
  }
}

const VendorList = ref()

const VendorDataList = ref()

const purMenoList = ref()

const Launchform3 = (row: any) => {
  VendorList.value = row[0].selectValue
  VendorDataList.value = row[1].dateValue
  purMenoList.value = row[2].selectValue
}

const formatCurrentDate = (date: any) => {
  const year = date.getFullYear()
  const month = date.getMonth() + 1
  const day = date.getDate()
  return `${year}-${month}-${day}`
}

const currentDate = ref(new Date())

// 出库批处理
const drawer2 = ref(false)

// 出库批处理
const FitSubMaterialQueryMethods1TableDates = ref()

const isLoading11 = ref(true)

const FitSubMaterialQueryMethods1 = async () => {
  isLoading11.value = true
  const result = await FitSubMaterialQuery(reqNo1.value, '', '')
  FitSubMaterialQueryMethods1TableDates.value = result.map((itme: any) => {
    if (itme.purFlag === 'Y') {
      itme.purFlag = true
    }
    itme.change = 'Y'
    itme.disableConfirm = true
    return itme
  })
  isLoading11.value = false
}
const returnOrderParms = ref('')
const returnOrderMethods = async () => {
  const result = await returnOrder(returnOrderParms.value)
  if (result.code === 200) {
    JMessage.success(result.message)
    MyPurchaseOrderMethods()
  } else {
    JMessage.error(result.message)
  }
}

const findClicked1 = async (row: any) => {
  if (row === '退单') {
    if (returnOrderParms.value === '') {
      return ElMessage.warning('请选择需要退单的数据')
    } else {
      returnOrderMethods()
    }
  }
  if (row === '形成订购单') {
    if (BatchProcessingOutOfStorageMethodsPamrs.value.length === 0) {
      JMessage.warning('请选择记录')
    } else {
      BatchProcessingOutOfStorageMethods()
    }
  }
  if (row === '出库批处理') {
    if (activeList.value) {
      formList3.value[0].inputValue = formatCurrentDate(currentDate.value)
      drawer2.value = true
      FitSubMaterialQueryMethods1()
    } else {
      JMessage.warning('请选择有订购单号的进行出库批处理查询')
    }
  }
  if (row === '打印未打印订购单') {
    typeList.value = 2
    purNoList.value = []
    await printListMehtods()
    printQRCode()
  }
  if (row === '打印选中订购单') {
    typeList.value = 1
    if (purNoList.value.length === 0) {
      return JMessage.warning('请选择有订购单号的数据进行打印')
    }
    await printListMehtods()
    printQRCode()
  }
}

const BatchProcessingOutOfStorageMethodsPamrs = ref<any>([])

const selectList5 = (row: any) => {
  BatchProcessingOutOfStorageMethodsPamrs.value = row.map((itme: any) => {
    return itme
  })

  purNoList.value = row.map((itme: any) => {
    return itme.purNo
  })

  if (VendorList.value !== '' || VendorDataList.value !== '' || purMenoList.value !== '') {
    BatchProcessingOutOfStorageMethodsPamrs.value = row.map((item: any) => {
      item.vendorNo = VendorList.value.split(' ')[0]
      item.vendorName = VendorList.value.split(' ')[1]
      item.vendorDate = VendorDataList.value
      item.purMemo = purMenoList.value
      item.inDate = VendorDataList.value
      return item
    })
    let newObject = Object.assign({}, row)

    // inputChange(newObject[0])
  }
}

// 形成订购单
const BatchProcessingOutOfStorageMethods = async () => {
  let active = <boolean>false
  if (active) {
    JMessage.warning('厂商和日期不可为空')
  } else {
    BatchProcessingOutMethods()
  }
}

const BatchProcessingOutMethods = async () => {
  let active = true

  // 遍历 BatchProcessingOutOfStorageMethodsPamrs.value
  for (const item of BatchProcessingOutOfStorageMethodsPamrs.value) {
    // 检查 vendorNo 和 vendorDate 是否为空
    if (item.vendorNo === null || item.vendorDate === null) {
      active = false
    }
    // 检查 purNo 是否存在
    if (item.purNo) {
      ElMessage.warning('有订购单号的不能形成订购单')
      return // 直接返回，停止后续执行
    }
  }

  // 如果 active 为 false，显示警告并返回
  if (!active) {
    return JMessage.warning('厂商和日期不可为空')
  }

  // 调用 BatchProcessingOutOfStorage 方法
  const result = await BatchProcessingOutOfStorage(BatchProcessingOutOfStorageMethodsPamrs.value)

  // 根据结果处理
  if (result.code === 200) {
    MyPurchaseOrderMethods()
    JMessage.success(`成功形成订购单,订购单号:${result.message}`)
  } else {
    MyPurchaseOrderMethods()
    JMessage.success(result.message)
  }
}

// 厂商
const VendorQueryMethods = async () => {
  let NewArray: never[] = []
  const result = await VendorQuery()
  NewArray = result.reduce((arr: any, item: any) => {
    if (item.vendorNo && item.vendorName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.vendorNo + ' ' + item.vendorName)
    }
    return arr
  }, [])
  formList2.value[3].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  formList5.value[0].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  formList6.value[4].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
}

// 分类获取
const EvaluatesTheArrayReturnValue = (ArrayList: any) => {
  return ArrayList.map((item: any, index: any) => {
    return {
      optionKey: index,
      optionValue: item,
      optionLabel: item
    }
  })
}

const classifyQueryMethods = async () => {
  let NewArray = []
  const result = await classifyQuery()
  NewArray = result.reduce((arr: any, item: any) => {
    if (item.typeNo && item.typeName) {
      // 只添加非空的 typeName 和 typeNo
      arr.push(item.typeNo + ' ' + item.typeName)
    }
    return arr
  }, [])
  formList2.value[2].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
  formList6.value[3].selectOptions = EvaluatesTheArrayReturnValue(NewArray)
}

// 贴合子材料查询
const FitSubMaterialQueryMethodsTableDateList = ref()

const FitSubMaterialQueryMethods = async () => {
  isLoading10.value = true
  const result = await FitSubMaterialQuery(reqNo1.value, purLot1.value, mtlNo1.value)
  FitSubMaterialQueryMethodsTableDateList.value = result
  isLoading10.value = false
}

// 指令明细
const reqNo1 = ref('')
const purLot1 = ref('')
const mtlNo1 = ref('')
const InstructionDetailQueryMedhotsTableDateList = ref()

const InstructionDetailQueryMedhots = async () => {
  isLoading9.value = true
  const result = await InstructionDetailQuery(reqNo1.value, purLot1.value, mtlNo1.value)
  InstructionDetailQueryMedhotsTableDateList.value = result
  isLoading9.value = false
}

// 进入我的订购单
const drawer3 = ref(false)

const clicktogetdata = (row: any) => {
  const { reqNo, purLot, mtlNo, purNo } = row
  if (purNo !== null) {
    activeList.value = true
  }
  reqNo1.value = reqNo
  purLot1.value = purLot
  mtlNo1.value = mtlNo
  returnOrderParms.value = row.id
  InstructionDetailQueryMedhots()
  FitSubMaterialQueryMethods()
}

const MyPurchaseOrderMethodsPamrs = ref<any>({
  flag1: 1,
  flag2: 0,
  mtlType: '',
  pageNum: 1,
  pageSize: 40,
  purColor: '',
  purDateEnd: '',
  purDateStart: '',
  purLot: '',
  purNo: '',
  purStyle: '',
  purType: '',
  vendorNo: '',
  mtlName:''
})

const Launchform1 = (row: any) => {
  MyPurchaseOrderMethodsPamrs.value.purNo = row[0].inputValue
  MyPurchaseOrderMethodsPamrs.value.mtlType = row[2].selectValue.split(' ')[0]
  MyPurchaseOrderMethodsPamrs.value.vendorNo = row[3].selectValue.split(' ')[0]
  MyPurchaseOrderMethodsPamrs.value.purDateStart = row[4].dateValue[0]
  MyPurchaseOrderMethodsPamrs.value.purDateEnd = row[4].dateValue[1]
  MyPurchaseOrderMethodsPamrs.value.purStyle = row[5].inputValue
  MyPurchaseOrderMethodsPamrs.value.purColor = row[6].inputValue
  MyPurchaseOrderMethodsPamrs.value.purLot = row[7].inputValue
  MyPurchaseOrderMethodsPamrs.value.mtlName = row[12].inputValue
  MyPurchaseOrderMethods()
}

const clickNumber = (row: number) => {
  MyPurchaseOrderMethodsPamrs.value.flag1 = Number(row)
  MyPurchaseOrderMethods()
}

const MyPurchaseOrderMethodsTableDateList = ref<MyPurchaseOrderInterface>({
  dtos: []
})

const MyPurchaseOrderMethods = async () => {
  isLoading8.value = true
  const result = await MyPurchaseOrder(MyPurchaseOrderMethodsPamrs.value)

  MyPurchaseOrderMethodsTableDateList.value.dtos = result.dtos.map((item: any) => {
    item.change = 'Y'
    item.disableConfirm = true
    return item
  })
  total.value = result.total!
  if (result.dtos.length > 0) {
    const { reqNo, purLot, mtlNo, mtlName, mtlUnit, dept, purDate, vendorDate, cancelQty, remark } = result.dtos[0]

    formList7.value[0].inputValue = mtlName
    formList7.value[1].inputValue = mtlNo
    formList7.value[2].inputValue = mtlUnit
    formList7.value[3].inputValue = reqNo
    formList7.value[4].inputValue = dept
    formList7.value[5].inputValue = purDate as string

    formList7.value[6].inputValue = vendorDate as string
    formList7.value[7].inputValue = remark
    formList7.value[8].inputValue = cancelQty

    reqNo1.value = reqNo
    purLot1.value = purLot
    mtlNo1.value = mtlNo
    FitSubMaterialQueryMethods()
    InstructionDetailQueryMedhots()
  }
  isLoading8.value = false
}

const total = ref(0)

const handleSizeChange = (val: number) => {
  MyPurchaseOrderMethodsPamrs.value.pageSize = val
  MyPurchaseOrderMethods()
}

const handleCurrentChange = (val: number) => {
  MyPurchaseOrderMethodsPamrs.value.pageNum = val
  MyPurchaseOrderMethods()
}

// 下单批处理
const OrderBatchProcessingMethodsParms = ref([])

const handleCloseMateriaLKlc3 = (_done?: () => void) => {
  ElMessageBox.confirm('确认要取数吗?')
    .then(async () => {
      OrderBatchProcessingMethods()
    })
    .catch(() => {})
}

const OrderBatchProcessingMethods = async () => {
  const result = await OrderBatchProcessing(OrderBatchProcessingMethodsParms.value)
  if (result.code === 200) {
    RequisitionEnquiryMethods()
    JMessage.success(result.message)
  } else {
    JMessage.error(result.message)
  }
}

const selectList6 = (row: any) => {
  OrderBatchProcessingMethodsParms.value = row.map((item: any) => {
    return item
  })
}

// 请购查询 - 订购处理

const RequisitionEnquiryMethodsParms = ref<RequisitionEnquiryParms>({
  color: '',
  lotNo: '',
  mtlName: '',
  pageNum: 1,
  pageSize: 40,
  style: ''
})

const RequisitionEnquiryMethodsTableDateList = ref<RequisitionEnquiryInterface>({
  dtos: []
})

const RequisitionEnquiryMethods = async () => {
  isLoading7.value = true
  const result = await RequisitionEnquiry(RequisitionEnquiryMethodsParms.value)
  RequisitionEnquiryMethodsTableDateList.value.dtos = result.dtos
  totalTk.value = result.total!
  isLoading7.value = false
}

const totalTk = ref(0)

const handleSizeChangeTk = (val: number) => {
  RequisitionEnquiryMethodsParms.value.pageSize = val
  RequisitionEnquiryMethods()
}

const handleCurrentChangeTk = (val: number) => {
  RequisitionEnquiryMethodsParms.value.pageNum = val
  RequisitionEnquiryMethods()
}

const Launchform = (row: any) => {
  RequisitionEnquiryMethodsParms.value.lotNo = row[0].inputValue
  RequisitionEnquiryMethodsParms.value.color = row[1].inputValue
  RequisitionEnquiryMethodsParms.value.mtlName = row[2].inputValue
  RequisitionEnquiryMethods()
}

const clearFormList2 = () => {
  formList1.value.forEach((item) => {
    if (item.type === 'input') {
      item.inputValue = ''
    }
    // Add other conditions for different form item types
  })
}

const findClicked = (count: string) => {
  if (count === '置空') {
    clearFormList2()
  }
  if (count === '下单批处理') {
    if (OrderBatchProcessingMethodsParms.value.length === 0) {
      JMessage.warning('请选择需要下单处理的数据')
    } else {
      handleCloseMateriaLKlc3()
    }
  }
  if (count === '进入我的订购单') {
    drawer3.value = true
    MyPurchaseOrderMethodsPamrs.value.flag2 = 1
    VendorQueryMethods()
    MyPurchaseOrderMethods()
    RemarkQueryMethods()
    classifyQueryMethods()
  }
  if (count === '进入所有订购单') {
    MyPurchaseOrderMethodsPamrs.value.flag2 = 2
    MyPurchaseOrderMethodsPamrs.value.flag1 = ''
    drawer4.value = true
    RemarkQueryMethods()
    classifyQueryMethods()
    VendorQueryMethods()
    MyPurchaseOrderMethods()
  }
}

// 统一调用接口
const interAceFunct = () => {
  RequisitionEnquiryMethods()
}
const companyId = ref()
onMounted(() => {
  companyId.value = sessionStorage.getItem('companyId')
  interAceFunct()
  
})

// 表格数据
const tableHeader = ref([
  {
    label: '类别',
    prop: 'slipType'
  },
  {
    label: '汇总号',
    prop: 'sumNo'
  },
  {
    label: '请购单号',
    prop: 'reqNo'
  },
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '客户',
    prop: 'custom'
  },
  {
    label: '物料编码',
    prop: 'mtlNo'
  },
  {
    label: '分类名称',
    prop: 'mtlType'
  },
  {
    label: '材料颜色',
    prop: 'mtlColor'
  },
  {
    label: '材料名称',
    prop: 'mtlName'
  },
  {
    label: '规格',
    prop: 'mtlSpec'
  },
  {
    label: '单位',
    prop: 'mtlUnit'
  },
  {
    label: '请购日期',
    prop: 'reqDate'
  },
  {
    label: '需求量',
    prop: 'ttlUsage'
  },
  {
    label: '预加量',
    prop: 'yQty'
  }
])

const tableHeader1 = ref([
  {
    label: '类别',
    prop: 'purType',
    change: true
  },
  {
    label: '型体',
    prop: 'purStyle',
    change: true
  },
  {
    label: '颜色',
    prop: 'purColor',
    change: true
  },
  {
    label: '指令',
    prop: 'purLot',
    change: true
  },
  {
    label: '分类名称',
    prop: 'mtlType',
    change: true
  },
  {
    label: '材料颜色',
    prop: 'mtlColor',
    change: true
  },
  {
    label: '材料名称',
    prop: 'mtlName',
    change: true
  },
  {
    label: '规格',
    prop: 'mtlSpec',
    change: true
  },
  {
    label: '单位',
    prop: 'mtlUnit',
    change: true
  },
  {
    label: '订购单号',
    prop: 'purNo',
    change: true
  },
  {
    label: '订购日期',
    prop: 'purDate',
    change: true
  },
  {
    label: '请购量',
    prop: 'qty',
    change: true
  },
  {
    label: '预加量',
    prop: 'overQty'
  },
  {
    label: '多购量',
    prop: 'minusQty'
  },
  {
    label: '订购数量',
    prop: 'purQty',
    change: true
  },
  {
    label: '厂商代码',
    prop: 'vendorNo',
    change: true
  },
  {
    label: '厂商名称',
    prop: 'vendorName',
    change: true
  },
  {
    label: '需求交期',
    prop: 'vendorDate',
    change: true
  },

  {
    label: '厂商回复交期',
    prop: 'inDate',
    change: true
  },
  {
    label: '贴合备注',
    prop: 'purMemo',
    change: true
  },
  {
    label: '导出日期',
    prop: 'expDate',
    change: true
  }
])

const tableHeader2 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '数量',
    prop: 'qty'
  }
])

const tableHeader3 = ref([
  {
    label: '料号',
    prop: 'subMtlNo'
  },
  {
    label: '颜色',
    prop: 'subMtlColor'
  },
  {
    label: '材料名称',
    prop: 'subMtlName'
  },
  {
    label: '规格',
    prop: 'subMtlSpec'
  },
  {
    label: '单位',
    prop: 'subMtlUnit'
  },
  {
    label: '数量',
    prop: 'subQty'
  },
  {
    label: '预加量',
    prop: 'yjQty'
  },
  {
    label: '库存数量',
    prop: 'subStkQty'
  },
  {
    label: '替代料号',
    prop: 'rSubMtlNo'
  },
  {
    label: '替代材料名称',
    prop: 'rSubMtlName'
  },
  {
    label: '规格',
    prop: 'rSubMtlSpec'
  },
  {
    label: '单位',
    prop: 'rSubMtlUnit'
  },
  {
    label: '库存数量',
    prop: 'rSubStkQty'
  },
  {
    label: '出库单号',
    prop: 'slipNo'
  }
])

const tableHeader5 = ref([
  {
    label: '请购单号',
    prop: 'reqNo',
    change: true
  },
  {
    label: '指令号',
    prop: 'lotNo'
  },
  {
    label: '料号',
    prop: 'subMtlNo'
  },
  {
    label: '颜色',
    prop: 'subMtlColor',
    change: true
  },
  {
    label: '材料名称',
    prop: 'subMtlName',
    change: true
  },
  {
    label: '规格',
    prop: 'subMtlSpec',
    change: true
  },
  {
    label: '单位',
    prop: 'subMtlUnit',
    change: true
  },
  {
    label: '数量',
    prop: 'subQty',
    change: true
  },
  {
    label: '预加量',
    prop: 'yjQty',
    change: true
  },
  {
    label: '库存数量',
    prop: 'subStkQty',
    change: true
  },
  {
    label: '不出库标记',
    type: 'checkbox',
    prop: 'purFlag',
    change: true
  },
  {
    label: '替代料号',
    prop: 'rSubMtlNo',
    change: true
  },
  {
    label: '替代材料名称',
    prop: 'rSubMtlName',
    change: true
  },
  {
    label: '规格',
    prop: 'rSubMtlSpec',
    change: true
  },
  {
    label: '单位',
    prop: 'rSubMtlUnit',
    change: true
  },
  {
    label: '库存数量',
    prop: 'rSubStkQty',
    change: true
  },
  {
    label: '出库单号',
    prop: 'slipNo',
    change: true
  }
])

const tableHeader6 = ref([
  {
    label: '类别',
    prop: 'purType',
    change: true
  },
  {
    label: '分类名称',
    prop: 'mtlType',
    change: true
  },
  {
    label: '材料颜色',
    prop: 'purColor',
    change: true
  },
  {
    label: '材料名称',
    prop: 'mtlName',
    change: true
  },
  {
    label: '规格',
    prop: 'mtlSpec',
    change: true
  },
  {
    label: '订购单号',
    prop: 'purNo',
    change: true
  },
  {
    label: '订购日期',
    prop: 'purDate',
    change: true
  },
  {
    label: '请购量',
    prop: 'qty',
    change: true
  },

  {
    label: '超买量',
    prop: 'minusQty',
    change: true
  },
  {
    label: '订购数量',
    prop: 'purQty',
    change: true
  },
  {
    label: '厂商名称',
    prop: 'vendorName',
    change: true
  },

  {
    label: '交期',
    prop: 'vendorDate',
    change: true
  },

  {
    label: '送货方式',
    prop: 'sendType',
    change: true
  },

  {
    label: '采购备注',
    prop: 'purMemo',
    change: true
  },
  {
    label: '采购员',
    prop: 'sysUser',
    change: true
  }
])

const tableHeader7 = ref([
  {
    label: '指令',
    prop: 'lotNo'
  },
  {
    label: '型体',
    prop: 'style'
  },
  {
    label: '数量',
    prop: 'qty'
  }
])
</script>

<style lang="less" scoped>
h1 {
  font-size: 16px;
}

.divNitive {
  :deep(th:nth-child(15)) {
    color: red !important;
  }

  :deep(th:nth-child(17)) {
    color: red !important;
  }

  :deep(th:nth-child(19)) {
    color: red !important;
  }

  :deep(th:nth-child(13)) {
    color: #0000ff !important;
  }

  :deep(th:nth-child(14)) {
    color: #0000ff !important;
  }

  :deep(th:nth-child(20)) {
    color: #0000ff !important;
  }

  :deep(th:nth-child(21)) {
    color: #0000ff !important;
  }
}

h1 {
  font-size: 15px;
}
</style>
